<template>
	<view class="page_box">
		<view class="head_box ">
			<yy-custom bgColor="bg-gradual-blue" v-if="0">
				<block slot="backText">返回</block>
				<block slot="content">导航栏</block>
			</yy-custom>
		</view>
		

		<view class="content_box padding-lr">
			<view class="logIn">登录</view>
			<view class="flex margin-top f26" @click="to('/pages/login/registered')">
				<text style="color: #999999;">还没有账号？</text>
				<text style="color: #FBB03B;">立即注册</text>
			</view>
			<view class="f28 flex   " style="margin-top: 82rpx;">
				<image src="../../static/shouji.png" mode="aspectFill" class="margin-right-sm " style="width: 25rpx;height: 37rpx;"></image>
				<text>手机</text>
			</view>
			<view class="solid-bottom flex align-center" style="height: 76rpx; margin-top: 26rpx;">
				<input type="number" value="" v-model="phone" placeholder="请输入您的手机号" placeholder-class="ddd" />
			</view>
			<view class="f28 flex " style="margin-top: 82rpx;">
				<image src="../../static/mima.png" mode="" class="margin-right-sm " style="width: 25rpx;height: 37rpx;"></image>
				<text>密码</text>
			</view>
			<view class="solid-bottom flex align-center" style="height: 76rpx; margin-top: 26rpx;">
				<input type="password" v-model="pwd" value="" placeholder="请输入登录密码" placeholder-class="ddd" v-if="mima" />
				<input type="text" v-model="pwd" value="" placeholder="请输入登录密码" placeholder-class="ddd" v-else />
				<text class="cuIcon-attentionfill" @click="flg" v-if="mima"></text>
				<text class="cuIcon-attentionfill" @click="flg" v-else></text>
			</view>
			<view class="flex justify-between f26" style="margin-top: 63rpx;">
				<text @click="to('/pages/login/verifyLogin')">验证码登录</text>
				<text @click="to('/pages/login/forgotPwd')">忘记密码？</text>
			</view>
			<view class="cu-btn btn flex justify-center align-center" @click="logInImmediately">立即登录</view>
			<view class="flex f22 privacyAgreement align-center justify-center">
				<text style="width: 28rpx; height: 28rpx;" class="cuIcon-roundcheck" v-if="check" @click="check = !check"></text>
				<text style="width: 28rpx; height: 28rpx;" class="cuIcon-roundaddfill" v-else @click="check = !check"></text>
				<view class="flex margin-left">
					<text>我已阅读并同意</text>
					<text style="color: #FBB03B;"@click="uni">《用户协议》</text>
				</view>
			</view>
		</view>
		<view class="foot_box"></view>
		<!-- 登录提示 -->
		<yy-login v-if="false"></yy-login>
		<!-- 加载提示 -->
		<yy-loading text="加载中.." mask="true" click="true" ref="loading"></yy-loading>
		<!-- 信息提示-->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
export default {
	components: {},
	data() {
		return {
			check: true,
			phone: '',
			// 18599932826
			pwd: '',
			mima: true
		};
	},
	onShow() {},
	onLoad(e) {},
	methods: {
		uni() {
			uni.navigateTo({
				url: 'privacyAgreement'
			});
		},
		async flg() {
			this.mima = !this.mima;
		},
		async logInImmediately() {
			if ([this.phone, this.pwd].includes('')) {
				return this.$refs.uToast.show({ title: '请填写完整后再登陆', type: 'error' });
			}

			if (!this.$u.test.mobile(this.phone)) {
				return this.$refs.uToast.show({ title: '请正确填写手机号码', type: 'error' });
			}

			let obj = {
				phone: this.phone,
				pwd: this.pwd
			};
			const res = await this.$u.get('user/pwdLogin', obj, {});

			if (res.code == 1) {
				this.$refs.uToast.show({ title: res.msg, type: 'error' });
				[this.phone, this.pwd] = '';
			}

			if (res.code == 0) {
				this.$refs.uToast.show({ title: '登录成功', type: 'success' });
				uni.setStorageSync('data', res.data);
				setTimeout(() => {
					uni.reLaunch({
						url: '../myTeam/myTeam'
					});
				}, 500);
			}
		},
		jump(url) {
			uni.switchTab({
				url
			});
		},
		to(url) {
			uni.navigateTo({
				url
			});
		}
	}
};
</script>

<style lang="scss" scoped>
.page_box {
	.content_box {
		padding-top: 44rpx;
		.logIn {
			font-size: 40rpx;

			font-weight: bold;
			color: #232323;
		}
		.ddd {
			font-size: 24rpx;

			font-weight: 500;
			color: #bdbdbd;
		}
		/deep/input {
			width: 100%;
			font-size: 30rpx;
			font-weight: 500;
			color: #000;
		}
		.btn {
			width: 686rpx;
			height: 90rpx;
			background: #92b9b7;
			border-radius: 45rpx;
			margin-top: 195rpx;

			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #ffffff;
		}
		.privacyAgreement {
			position: fixed;
			bottom: 50rpx;
			left: 50%;
			transform: translateX(-50%);
			.check {
				display: block;
				width: 23rpx;
				height: 23rpx;
				background-color: #fbb03b;
				color: #ffffff;
			}
		}
	}
}
</style>
